<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" type="text/css" href="../../../../Themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../../../../Themes/icon.css">
		<link rel="stylesheet" type="text/css" href="../../../../CSS/demo.css">
		<link rel="stylesheet" type="text/css" href="../../../../CSS/common.css">
		<script type="text/javascript" src="../../../../JS/common.js"></script>
		<script type="text/javascript" src="../../../../JS/jquery.min.js"></script>
		<script type="text/javascript" src="../../../../JS/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="../../../../JS/map.js"></script>
		<style>
			.right_postion {
				position: absolute;
				left: 750px;
				color: blue;
				font-weight: 300;
			}
			
			.left_postion {
				position: absolute;
				left: 40px;
				color: blue;
				font-weight: 300;
			}
			
			#maptitle {
				color: blue;
				font-weight: 600;
				font-size: 15px;
				margin-left: 340px;
				margin-top: 50px;
			}
		</style>
	</head>

	<body>
		<div style="text-align: left; ">
			<p id="maptitle"></p>
			<div id="left_top" class="left_postion"></div>
			<div id="right_top" class="right_postion"></div>
			<img src="../../../../images/map/map-3-1/临时大棚1.jpg" usemap="#1" style="border-style:none" />
			<map id="1" name="1">
</map>
			<div id="left_bottom" class="left_postion"></div>
			<div id="right_bottom" class="right_postion"></div>
		</div>
	</body>
	<script type="text/javascript">
		var _left_top_num = 0;
		var _left_bottom_num = 0;
		var _right_top_num = 0;
		var _right_bottom_num = 0;
		var _tmp="1";
//		var _tmp = getID();
		
		var _leftAreaData= new Object();
		var _rightAreaData=new Object();
		_leftAreaData.len=20;
		_leftAreaData.x1=50;
		_leftAreaData.y1=413;
		_leftAreaData.x2=112;
		_leftAreaData.y2=424;
		_leftAreaData.offset=14;
		_leftAreaData.type="vertical";//水平方向
		_leftAreaData.firstnum=21;
		
		_rightAreaData.len=20;
		_rightAreaData.x1=700;
		_rightAreaData.y1=21;
		_rightAreaData.x2=726;
		_rightAreaData.y2=67;
		_rightAreaData.offset=40;
		_rightAreaData.type="horizontal";//水平方向
		_rightAreaData.firstnum=1;
		
		var _leftData=CreateAreaData(_leftAreaData);
		var _rightData=CreateAreaData(_rightAreaData);
		var areacontent=CreateAreaHTML(_leftData);
		$("#1").append(areacontent);
		var areacontent=CreateAreaHTML(_rightData);
		$("#1").append(areacontent);
        modiAreaTitle();
		getTipNum();
		function getTipNum() {
			var bh = parseInt(_tmp.substring(0, 1));
			_left_bottom_num = (bh - 1) * 40 + 20;
			_right_bottom_num = (bh - 1) * 40 + 1;
			_left_top_num = (bh - 1) * 40 + 40;
			_right_top_num = (bh - 1) * 40 + 21;
			$("#left_bottom").html(_left_bottom_num);
			$("#right_bottom").html(_right_bottom_num);
			$("#left_top").html(_left_top_num);
			$("#right_top").html(_right_top_num);
			$("#maptitle").html("蔬菜批发区" + bh + "号大棚");

		}

		function modiAreaTitle() {
			for(var i = 21; i < 22; i++) {
				var _id = "area" + i;
				var _plocation = getLocation(i);
				console.log(_plocation);
				document.getElementById(_id).setAttribute("title", _plocation);
			}

		}

		function getLocation(_num) {
			var bh = _tmp.substring(0, 1);
			console.log(bh);
			var boost_num = (parseInt(bh) - 1) * 40 + _num;
			var _location = "蔬菜批发区" + _tmp + "门牌号" + boost_num;
			return _location;
		}

		$(function() {
          $("area").each(function(index,element){
        	showTips($(this), "");
          });
		});
		////查看商铺的详细信息
		function BoostDetail() {
			console.log("查看商铺详细信息");
		}
	</script>

</html>